<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>Page Title</title>
  <link rel="stylesheet" type="text/css" href="./nor.css"><link>
  <style>
    body {
  background: #f06d06;
  font-size: 80%;
}

main {
  background: white;
  margin: 20px 0;
  padding: 10px;
}

main div {
  background: black;
  color: white;
  padding: 15px;
  max-width: 125px;
  margin: 5px;
}
  </style>
</head>
<body>
    <main class="inline-block-center">
        <div>
          I'm an element that is block-like with my siblings and we're centered in a row.
        </div>
        <div>
          I'm an element that is block-like with my siblings and we're centered in a row. I have more content in me than my siblings do.
        </div>
        <div>
          I'm an element that is block-like with my siblings and we're centered in a row.
        </div>
      </main>
</body>
</html>